// src/pages/task/schedule/components/ScheduleModal.tsx - 任务计划模态框组件
import React from 'react';
import { Modal, Form, Input, Select } from 'antd';
import { ScheduleCreateForm, ScheduleItem } from '../types';

const { Option } = Select;

interface ScheduleModalProps {
  visible: boolean;
  onCancel: () => void;
  onOk: () => void;
  form: any;
  onFinish: (values: ScheduleCreateForm) => void;
  mode: 'create' | 'edit';
  initialValues?: ScheduleItem;
}

const ScheduleModal: React.FC<ScheduleModalProps> = ({
  visible,
  onCancel,
  onOk,
  form,
  onFinish,
  mode,
  initialValues
}) => {
  // 处理初始值
  const getInitialValues = () => {
    if (mode === 'edit' && initialValues) {
      return {
        ...initialValues,
      };
    }
    
    // 创建模式使用默认值
    return {
      task_type: "normal",
    };
  };

  return (
    <Modal
      title={mode === 'create' ? "新增任务计划" : "编辑任务计划"}
      open={visible}
      onCancel={onCancel}
      onOk={onOk}
      width={800}
    >
      <Form
        form={form}
        layout="vertical"
        onFinish={onFinish}
        initialValues={getInitialValues()}
      >
        <Form.Item
          name="name"
          label="任务名称"
          rules={[{ required: true, message: '请输入任务名称' }]}
        >
          <Input placeholder="请输入任务名称" />
        </Form.Item>

        {mode === 'create' && (
          <Form.Item
            name="code"
            label="任务代码"
            rules={[{ required: true, message: '请输入任务代码' }]}
          >
            <Input placeholder="请输入任务代码" />
          </Form.Item>
        )}

        <Form.Item
          name="description"
          label="任务描述"
        >
          <Input.TextArea placeholder="请输入任务描述" rows={3} />
        </Form.Item>

        <Form.Item
          name="task_type"
          label="任务类型"
        >
          <Select>
            <Option value="normal">普通任务</Option>
            <Option value="interval">间隔任务</Option>
            <Option value="crontab">定时任务</Option>
          </Select>
        </Form.Item>

        <Form.Item
          noStyle
          shouldUpdate={(prevValues, currentValues) => prevValues.task_type !== currentValues.task_type}
        >
          {({ getFieldValue }) => {
            const taskType = getFieldValue('task_type');
            return (
              <>
                {taskType === 'crontab' && (
                  <Form.Item
                    name="crontab"
                    label="Crontab表达式"
                    rules={[{ required: true, message: '请输入Crontab表达式' }]}
                  >
                    <Input placeholder="请输入Crontab表达式" />
                  </Form.Item>
                )}
                {taskType === 'interval' && (
                  <Form.Item
                    name="interval"
                    label="执行间隔"
                    extra={'以秒为单位的执行间隔，例如: {"seconds": 30} 或 {"minutes": 5}'}
                    rules={[{ required: true, message: '请输入执行间隔' }]}
                  >
                    <Input placeholder='{"seconds": 30}' />
                  </Form.Item>
                )}
              </>
            );
          }}
        </Form.Item>

        <Form.Item
          name="args"
          label="位置参数"
          extra='JSON格式的数组，例如: [1, 2, "hello"]'
        >
          <Input.TextArea placeholder='[1, 2, "hello"]' rows={2} />
        </Form.Item>

        <Form.Item
          name="kwargs"
          label="关键字参数"
          extra={'JSON格式的对象，例如: {"name": "test", "count": 10}'}
        >
          <Input.TextArea placeholder='{"name": "test", "count": 10}' rows={2} />
        </Form.Item>
      </Form>
    </Modal>
  );
};

export default ScheduleModal;